<template>
  <div
    :class="[log_info_border_cla]"
    :id="log_info_border_id + id_split + props.id"
  >
    <div
      :class="[log_info_title_cla]"
      :id="log_info_title_id + id_split + props.id"
    >
      浮动元素 {{ props.id }} 展示 选项卡
    </div>
    <div
      :class="[log_info_quick_func_border_cla, css_wind_light_hover]"
      :id="log_info_quick_func_border_id + id_split + props.id"
      v-prograss_bar
    >
      <div
        :class="[
          log_info_quick_func_uni_item_cla,
          log_info_quick_func_select_all_cla,
        ]"
        :id="log_info_quick_func_select_all_id + id_split + props.id"
      >
        全选
      </div>
      <div
        :class="[
          log_info_quick_func_uni_item_cla,
          log_info_quick_func_reselect_cla,
        ]"
        :id="log_info_quick_func_reselect_id + id_split + props.id"
      >
        重选
      </div>
    </div>
    <div
      :class="[log_info_display_border_cla, css_wind_light]"
      :id="log_info_display_border_id + id_split + props.id"
      style="--grid_cloumn_num: 3"
    >
      <div
        :class="[log_info_display_uni_item_cla, css_wind_light_hover]"
        :id="log_info_display_uni_item_id + id_split + props.id"
        keyVal="events"
      >
        历史版本
      </div>
      <div
        :class="[log_info_display_uni_item_cla, css_wind_light_hover]"
        :id="log_info_display_uni_item_id + id_split + props.id"
        keyVal="events"
      >
        事件
      </div>
      <div
        :class="[log_info_display_uni_item_cla, css_wind_light_hover]"
        :id="log_info_display_uni_item_id + id_split + props.id"
        keyVal="events"
      >
        事件
      </div>
      <div
        :class="[log_info_display_uni_item_cla, css_wind_light_hover]"
        :id="log_info_display_uni_item_id + id_split + props.id"
        keyVal="events"
      >
        事件
      </div>
    </div>
    <div
      :class="[log_info_submit_border_cla]"
      :id="log_info_submit_border_id + id_split + props.id"
    >
      <button
        :class="[log_info_submit_certain_cla, css_wind_light_hover]"
        :id="log_info_submit_certain_id + id_split + props.id"
      >
        确认
      </button>

      <button
        :class="[log_info_submit_cancel_cla, css_wind_light_hover]"
        :id="log_info_submit_cancel_id + id_split + props.id"
      >
        取消
      </button>
    </div>
  </div>
</template>

<script setup>
import { onMounted } from 'vue';

import './log_info.css';
import { id_split } from '../../../../DataDefine/sourceData';
import {
  log_info_border_cla,
  log_info_border_id,
  log_info_display_border_cla,
  log_info_display_border_id,
  log_info_display_uni_item_cla,
  log_info_display_uni_item_id,
  log_info_quick_func_border_cla,
  log_info_quick_func_border_id,
  log_info_quick_func_reselect_cla,
  log_info_quick_func_reselect_id,
  log_info_quick_func_select_all_cla,
  log_info_quick_func_select_all_id,
  log_info_quick_func_uni_item_cla,
  log_info_submit_border_cla,
  log_info_submit_border_id,
  log_info_submit_cancel_cla,
  log_info_submit_cancel_id,
  log_info_submit_certain_cla,
  log_info_submit_certain_id,
  log_info_title_cla,
  log_info_title_id,
} from './DataDefine/sourceData';
import {
  css_wind_light,
  css_wind_light_hover,
} from '../../../../../DataDefine/sourceData';

let props = defineProps({
  id: String,
});

onMounted(() => {});
</script>
